<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>茶叶</title>
    <script src="../js/utils/mock-min.js"></script>
    <script src="../js/utils/register.js"></script>
    <script src="../js/utils/jquery.min.js"></script>
    <script src="../js/utils/idadd.js"></script>
    <script src="../js/api/mockShow.js"></script>
    <script src="../js/compotents/teaPage.js"></script>

    <link rel="stylesheet" href="../css/teaPage.css">
    <link rel="stylesheet" href="../fonts/iconfont.css">
</head>

<body>
    <!-- 头部区域 -->
    <div class="header">
        <!-- logo区域 -->
        <div class="header_logo">
            <img src="../img/logo.webp" alt="">
        </div>
        <!-- 导航栏区域 -->
        <div class="header_nav clearfloat">
            <ul class="right">
                <li><a href="./01-首页.html">首页</a></li>
                <li><a href="./02-关于.html">关于</a></li>
                <li><a href="./03-茶叶.html">茶叶</a></li>
                <li><a href="./04-基地.html">基地</a></li>
                <li><a href="./05-新闻.html">新闻</a></li>
                <li><a href="./06-联系.html">联系</a></li>
            </ul>
        </div>
        <!-- 用户区域 -->
        <div class="header_icon">
            <span class="iconfont icon-sousuo"></span>
            <span class="iconfont icon-yonghu" onclick="location.href='07-register.html'"></span>
            <span class="iconfont icon-gouwuche" onclick="location.href='08-shopcar.html'"></span>
        </div>
    </div>
    <!-- 茶叶种类 -->
    <div class="tea_type">
        <div class="tea_content">
            <div class="tea_title">茶叶</div>
            <ul>
                <li onclick="change(7)">全部</li>
                <li onclick="change(0)">绿茶</li>
                <li onclick="change(1)">黄茶</li>
                <li onclick="change(2)">乌龙茶</li>
                <li onclick="change(3)">红茶</li>
                <li onclick="change(4)">黑茶</li>
                <li onclick="change(5)">白茶</li>
                <li onclick="change(6)">花茶</li>
            </ul>
        </div>
    </div>
    <!-- 图片介绍 -->
    <div class="article">
        <div class="article_content" id="tea">
            <!-- <div class="article_div">
                <img src="../img/tea_img1.webp" alt="">
                <div class="article_a"><a href="#">茉莉花茶</a></div>
                <p>￥223.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img2.webp" alt="">
                <div class="article_a"><a href="#">白牡丹</a></div>
                <p>￥1235.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img3.webp" alt="">
                <div class="article_a"><a href="#">白毫银针</a></div>
                <p>￥258.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img4.webp" alt="">
                <div class="article_a"><a href="#">云南普洱茶</a></div>
                <p>￥500.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img5.webp" alt="">
                <div class="article_a"><a href="#">湖北老青茶</a></div>
                <p>￥400.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img6.webp" alt="">
                <div class="article_a"><a href="#">霍山黄芽蒙洱银针</a></div>
                <p>￥711.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img7.webp" alt="">
                <div class="article_a"><a href="#">蒙顶黄芽</a></div>
                <p>￥450.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img8.webp" alt="">
                <div class="article_a"><a href="#">冻顶乌龙茶</a></div>
                <p>￥620.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img9.webp" alt="">
                <div class="article_a"><a href="#">大红袍</a></div>
                <p>￥3480.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img10.webp" alt="">
                <div class="article_a"><a href="#">祁门红茶</a></div>
                <p>￥568.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img11.webp" alt="">
                <div class="article_a"><a href="#">正山小种</a></div>
                <p>￥952.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img12.webp" alt="">
                <div class="article_a"><a href="#">西湖龙井特级</a></div>
                <p>￥888.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div>
            <div class="article_div">
                <img src="../img/tea_img13.webp" alt="">
                <div class="article_a"><a href="#">洞庭碧螺春</a></div>
                <p>￥880.0</p>
                <span class="iconfont icon-arrow-right-full"></span>
            </div> -->

        </div>
        <!-- 跳转页码 -->
        <div class="article_page">
            <div class="article_page_content">
                <div>1</div>
                <div>2</div>
                <div>下一页</div>
                <div>最后一页</div>
            </div>
        </div>
    </div>
    <!-- foot 页脚 -->
    <div class="foot">
        <div class="foot_art">
            <div class="foot_content">
                <div class="foot_contact">
                    <p>联系</p>
                    <p>Contact</p>
                </div>
                <div class="foot_our">
                    <p>关注我们</p>
                    <span class="iconfont icon-weixinlogo "></span>
                    <span class="iconfont icon-weibo-logo"></span>
                </div>
                <div class="foot_article">
                    <p>起飞页自助建站平台</p>
                    <p>地址:苏州市建外SOHO东区2号楼</p>
                    <p>邮编:100000</p>
                    <p>电话:010-69557550</p>
                </div>
                <div class="foot_erweima">
                    <img src="../img/shouye-foot-erweima1.webp" alt="">
                    <p>微信</p>
                </div>
                <div class="foot_erweima">
                    <img src="../img/shouye-foot-erweima2.webp" alt="">
                    <p>微博</p>
                </div>

            </div>

        </div>
        <div class="foot_bottom">
            <p>COPYRIGHT (©) 2019 茶叶类网站 京ICP备41414141414-1号</p>
        </div>
    </div>

</body>

</html>